//
//  StressDetailView.swift
//  Kosspot
//
//  Created by 李鑫 on 2025/7/30.
//

import SwiftUI

struct StressDetailView: View {
    @State private var selectedDate: Date = Date()
    @State var progress: Double = Double(Double.random(in: 0...1))
    @State var progress1: Double = Double(Double.random(in: 0.3...1))
    @State var progress2: Double = Double(Double.random(in: 0.6...1))
    @State var progress3: Double = Double(Double.random(in: 0.8...1))
    let data: [DataItem] = {
            var items = [DataItem]()
            for hour in 0..<25 {
                let timeString = String(format: "%02d:00", hour)
                let randomScore = Int.random(in: 0...100)
                items.append(DataItem(timeRange: timeString, stressScore: Double(randomScore)))
            }
            return items
        }()
    
    var body: some View {
        VStack {
            CustomNavigationBar(rightImageName: nil, title: "压力") {}
            HStack {
                WeekdayPicker(backGroundColor: Color(hex: "#6BC2FC")) { Date in
                    print(Date)
                    selectedDate = Date
                }
                Image("日历 1")
                    .resizable()
                    .frame(width: 20,height: 20)
                    .onTapGesture {
                        
                    }
            }
            .padding(.horizontal,12)
            
            ScrollView(.vertical,showsIndicators: false) {
                VStack(alignment: .leading) {
                    Text("4月8日 21：53")
                        .font(.system(size: 14))
                        .foregroundStyle(Color(hex: "#B2B2B2"))
                        .padding(.leading,16)
                        .padding(.top,16)
                    Spacer().frame(height: 8)
                    Text("41轻度压力")
                        .font(.system(size: 24))
                        .foregroundStyle(Color(hex: "#FFFFFF"))
                        .padding(.leading,16)
                    Spacer().frame(height: 12)
                    StressChartView(data: data)
                        .padding(.horizontal,27)
                        .padding(.bottom,16)
                }
                .background(Color(hex: "#1E1E1E"))
                .cornerRadius(16, corners:[.topLeft,.topRight,.bottomLeft,.bottomRight])
                .padding(.horizontal,12)
                Spacer().frame(height: 12)
                
                VStack(alignment: .leading) {
                    Text("压力评价")
                        .font(.system(size: 16))
                        .foregroundStyle(Color(hex: "#B2B2B2"))
                        .padding(.leading,20)
                        .padding(.top,20)
                    HStack(spacing: 40) {
                        HStack(spacing: 8) {
                            Circle()
                                .fill(Color(hex: "#66B3F7"))
                                .frame(width: 7,height: 7)
                            Text("放松")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                        HStack(spacing: 8) {
                            Circle()
                                .fill(Color(hex: "#8CF67F"))
                                .frame(width: 7,height: 7)
                            Text("正常")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                        HStack(spacing: 8) {
                            Circle()
                                .fill(Color(hex: "#F7C266"))
                                .frame(width: 7,height: 7)
                            Text("中等")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                        HStack(spacing: 8) {
                            Circle()
                                .fill(Color(hex: "##F76666"))
                                .frame(width: 7,height: 7)
                            Text("偏高")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                    }
                    .padding(.horizontal,30)
                    Spacer().frame(height: 24)
                    
                    HStack(spacing: 92.5) {
                        VStack(spacing: 12) {
                            Text("平均值")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                            Text("--")
                                .font(.system(size: 20))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                        VStack(spacing: 12) {
                            Text("最低值")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                            
                            Text("--")
                                .font(.system(size: 20))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                        VStack(spacing: 12) {
                            Text("最高值")
                                .font(.system(size: 14))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                            
                            Text("94")
                                .font(.system(size: 20))
                                .foregroundStyle(Color(hex: "#FFFFFF"))
                        }
                    }
                    .padding(.horizontal,20)
                    .padding(.bottom,12)
                }
                .background(Color(hex: "#1E1E1E"))
                .cornerRadius(16, corners:[.topLeft,.topRight,.bottomLeft,.bottomRight])
                .padding(.horizontal,12)
                Spacer().frame(height: 12)
                
                VStack(alignment: .leading) {
                    Text("压力评价")
                        .font(.system(size: 16))
                        .foregroundStyle(Color(hex: "#B2B2B2"))
                        .padding(.leading,20)
                        .padding(.top,20)
                    Spacer().frame(height: 18)
                    HStack(spacing: 30) {
                        ZStack {
                            Circle()
                                .stroke(Color(hex: "#707070"), lineWidth: 4)
                            Circle()
                                .trim(from: 0, to: progress)
                                .stroke(
                                    progress*100<29 ? Color(hex: "#66B3F7"):
                                    progress*100<59 ? Color(hex: "#8CF67F"):
                                    progress*100<79 ? Color(hex: "#F7C266"):
                                     Color(hex: "#F76666"),
                                        style: StrokeStyle(
                                    lineWidth: 4,
                                    lineCap: .round)
                                )
                                .rotationEffect(.degrees(-90))
                            VStack {
                                Text("\(Int(progress*100))")
                                    .font(.system(size: 12))
                                    .foregroundStyle(Color(hex: "#FFFFFF"))
                                Text("得分")
                                    .font(.system(size: 12))
                                    .foregroundStyle(Color(hex: "#FFFFFF"))
                            }
                        }
                        .frame(width: 60, height: 60)
                        .padding(.leading,20)
                        
                        Rectangle()
                            .fill(Color(hex: "#585858"))
                            .frame(width: 1,height: 40)
                        
                        VStack (alignment: .leading,spacing: 12) {
                            Text("暂无数据")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
                            Text("请坚持佩戴手表，时刻了解您的身体状况")
                                .font(.system(size: 14))
                                .foregroundStyle(.white)
                                .lineLimit(2)
                            
                        }
                    }
                    .padding(.horizontal,20)
                    Spacer().frame(height: 26)
                    
                    VStack(spacing: 16) {
                        HStack(spacing: 4) {
                            Text("轻松")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
//                            Text(progress*100<29 ?"（1-29）":
//                                 progress*100<59 ?"（30-59）":
//                                 progress*100<79 ?"（60-79）":
//                                 "（80-100）"
//                            )
                            Text("（1-29）")
                                .font(.system(size: 12))
                                .foregroundStyle(.white)
                            Spacer()
                            Text("\(Int(progress*100))%")
                                .font(.system(size: 18))
                                .foregroundStyle(.white)
                        }
                        ProgressView(value: progress, total: 1.0)
                            .progressViewStyle(.linear)
                            .background(Color(hex: "#8A8A8A"))
                            .tint( progress*100<29 ? Color(hex: "#66B3F7"):
                                    progress*100<59 ? Color(hex: "#8CF67F"):
                                    progress*100<79 ? Color(hex: "#F7C266"):
                                     Color(hex: "#F76666")
                            )
                            .frame(height: 6)
                            .cornerRadius(3)
                    }
                    .padding(.horizontal,20)
                    Spacer().frame(height: 24)
                    
                    VStack(spacing: 16) {
                        HStack(spacing: 4) {
                            Text("正常")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
//                            Text(progress*100<29 ?"（1-29）":
//                                 progress*100<59 ?"（30-59）":
//                                 progress*100<79 ?"（60-79）":
//                                 "（80-100）"
//                            )
                            Text("（30-59）")
                                .font(.system(size: 12))
                                .foregroundStyle(.white)
                            Spacer()
                            Text("\(Int(progress1*100))%")
                                .font(.system(size: 18))
                                .foregroundStyle(.white)
                        }
                        ProgressView(value: progress1, total: 1.0)
                            .progressViewStyle(.linear)
                            .background(Color(hex: "#8A8A8A"))
                            .tint( progress1*100<29 ? Color(hex: "#66B3F7"):
                                    progress1*100<59 ? Color(hex: "#8CF67F"):
                                    progress1*100<79 ? Color(hex: "#F7C266"):
                                     Color(hex: "#F76666")
                            )
                            .frame(height: 6)
                            .cornerRadius(3)
                    }
                    .padding(.horizontal,20)
                    Spacer().frame(height: 24)
                    
                    VStack(spacing: 16) {
                        HStack(spacing: 4) {
                            Text("中等")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
//                            Text(progress*100<29 ?"（1-29）":
//                                 progress*100<59 ?"（30-59）":
//                                 progress*100<79 ?"（60-79）":
//                                 "（80-100）"
//                            )
                            Text("（60-79）")
                                .font(.system(size: 12))
                                .foregroundStyle(.white)
                            Spacer()
                            Text("\(Int(progress2*100))%")
                                .font(.system(size: 18))
                                .foregroundStyle(.white)
                        }
                        ProgressView(value: progress2, total: 1.0)
                            .progressViewStyle(.linear)
                            .background(Color(hex: "#8A8A8A"))
                            .tint( progress2*100<29 ? Color(hex: "#66B3F7"):
                                    progress2*100<59 ? Color(hex: "#8CF67F"):
                                    progress2*100<79 ? Color(hex: "#F7C266"):
                                     Color(hex: "#F76666")
                            )
                            .frame(height: 6)
                            .cornerRadius(3)
                    }
                    .padding(.horizontal,20)
                    Spacer().frame(height: 24)
                    
                    
                    VStack(spacing: 16) {
                        HStack(spacing: 4) {
                            Text("偏高")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
//                            Text(progress*100<29 ?"（1-29）":
//                                 progress*100<59 ?"（30-59）":
//                                 progress*100<79 ?"（60-79）":
//                                 "（80-100）"
//                            )
                            Text("（80-100）")
                                .font(.system(size: 12))
                                .foregroundStyle(.white)
                            Spacer()
                            Text("\(Int(progress3*100))%")
                                .font(.system(size: 18))
                                .foregroundStyle(.white)
                        }
                        ProgressView(value: progress3, total: 1.0)
                            .progressViewStyle(.linear)
                            .background(Color(hex: "#8A8A8A"))
                            .tint( progress3*100<29 ? Color(hex: "#66B3F7"):
                                    progress3*100<59 ? Color(hex: "#8CF67F"):
                                    progress3*100<79 ? Color(hex: "#F7C266"):
                                     Color(hex: "#F76666")
                            )
                            .frame(height: 6)
                            .cornerRadius(3)
                    }
                    .padding(.horizontal,20)
                    Spacer().frame(height: 24)
                    VStack {
                        HStack {
                            Image("wenhao")
                                .resizable()
                                .frame(width: 16,height: 16)
                            Text("数据分析")
                                .font(.system(size: 16))
                                .foregroundStyle(.white)
                            Spacer()
                        }
                        Spacer().frame(height: 12)
                        Text("当前压力适中，适度的压力有助于高效工作与生活，能够较好地调度资源以应对外界的刺激，主动选择对您有益的环境和活动，比如轻松的户外散步，有助于维持平收起静。")
                            .font(.system(size: 14))
                            .foregroundStyle(.white)
                            .lineLimit(10)
                    }
                    .padding(.bottom,20)
                    .padding(.horizontal,20)
                }
                .background(Color(hex: "#1E1E1E"))
                .cornerRadius(16, corners:[.topLeft,.topRight,.bottomLeft,.bottomRight])
                .padding(.horizontal,12)
                .padding(.bottom,12)
               
            }
        }
        .navigationBarHidden(true)
        .background(Color(hex: "#0A0A0A"))
        .edgesIgnoringSafeArea(.all)
    }
}

#Preview {
    StressDetailView()
}
